<template>
  <div class="wrap">
    <router-view></router-view>
    <van-nav-bar title="首页" />
    <div class="grid">
      <van-grid>
        <van-grid-item
          @click="clickGrid(item.text)"
          v-for="(item, index) in gridList"
          :key="index"
          icon="photo-o"
          :text="item.text"
        />
      </van-grid>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      gridList: [
        {
          value: "0",
          index: 0,
          text: "理财",
        },
        {
          value: "1",
          index: 1,
          text: "保险",
        },
        {
          value: "2",
          index: 2,
          text: "转账",
        },
        {
          value: "3",
          index: 3,
          text: "贷款",
        },
      ],
    };
  },

  computed: {},

  mounted() {},

  methods: {
    // 点击宫格
    clickGrid(val) {
      console.warn(val);
      // 以下为路由传参示例-自行修改
      switch (val) {
        case "理财":
          this.$router.push({
            name: "moneyManagement",
            params: { title: val },
          });
          break;
        case "保险":
          this.$router.push({
            name: "Insurance",
            params: { title: val },
          });
          break;
        case "转账":
          this.$router.push({
            name: "Transfer",
            params: { title: val },
          });
          break;
        case "贷款":
          this.$router.push({
            name: "loan",
            params: { title: val },
          });
          break;
      }
    },
  },

  // this.$router.push({ name: 'transferManagement', params: { title: val }})
};
</script>
<style lang="scss" scoped>
.wrap {
  .grid {
    margin-top: 1rem;
  }
}
</style>
